<!--
 * @Author: wwssaabb
 * @Date: 2021-05-26 08:19:22
 * @LastEditTime: 2021-05-26 09:38:57
 * @FilePath: \demo\canvas_demo\demo_API\text.html
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>canvas_demo text</title>
  <style>
    * {
      margin: 0;
      padding: 0;
    }

    body {
      width: 100vw;
      height: 100vh;
      display: flex;
      justify-content: center;
      align-items: center;
    }
  </style>
</head>

<body>
  <canvas id="canvas1" width="800px" height="600px"></canvas>

  <script type="text/javascript">
    let canvas = document.querySelector('#canvas1')
    let ctx = canvas.getContext('2d')

    ctx.font = 'bold 20px 黑体'
    ctx.fillText('如果国家把长相分等级的话，你的长相，都可以吃低保了。', 100, 80)
    ctx.fillText('有病你治病，你别找我啊，我又不是兽医。。', 420, 60)
    ctx.fillText('你傻了吧唧好像我去年路过怡红院的那个老鸨的狗咬死的一只鸡', 80, 40)
    ctx.strokeText('东边不亮西边亮，你爹啥样我啥样', 10, 20)
    ctx.strokeText('你不适合待在垃圾桶里，毕竟垃圾也要分类，而你只是个杂碎', 80, 100)
    ctx.strokeText('今天想骂人，所以不骂你', 10, 140)

    ctx.stroke()
  </script>

</body>

</html>